<%--
  Created by IntelliJ IDEA.
  User: CBo
  Date: 2025/10/13
  Time: 20:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<jsp:include page="header.jsp"/>
<html>
<head>
    <title>班级学生列表</title>
    <style>
        .container {
            max-width: 1200px;
        }

        .action-buttons .btn {
            margin-right: 5px;
        }

        .table-responsive {
            min-height: 400px;
        }

        .card {
            --bs-card-border-width: 0;
        }
    </style>
</head>
<body>
<c:set var="classId" value="${param.classId}"/>
<div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-3" id="classesTitle">
        <h5>班级学生列表</h5>
        <a href='./classesinfo' class='btn btn-primary'>返回班级信息列表</a>
    </div>
    <div class="card">
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>学生ID</th>
                        <th>身份证</th>
                        <th>学生姓名</th>
                        <th>性别</th>
                        <th>创建时间</th>
                        <th>年龄</th>
                        <th>教育背景</th>
                        <th>电话</th>
                    </tr>
                    </thead>
                    <tbody id="classesTableBody">
                    <c:set var="pageitem" scope="session" value="${page.items}"/>
                    <c:if test="${empty pageitem}">
                        <tr>
                            <td colspan="9" class="text-center">没有匹配的班级学生数据</td>
                        </tr>
                    </c:if>
                    <c:forEach items="${sessionScope.page.items}" var="student" varStatus="status">
                        <tr>
                            <td>${(sessionScope.page.pageIndex-1)*sessionScope.page.pageSize+status.count}</td>
                            <td>${student.id}</td>
                            <td>${student.idCard}</td>
                            <td>${student.name}</td>
                            <td>${student.gender ? "男" : "女"}</td>
                            <td>${student.createDate}</td>
                            <td>${student.age}</td>
                            <td>${student.eduBackground}</td>
                            <td>${student.phone}</td>
                        </tr>
                    </c:forEach>
                    </tbody>
                </table>
            </div>
            <!-- 分页 -->
            <jsp:include page="pagination.jsp"/>
        </div>
    </div>
</div>


<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
<script>
    let classes = [];
    //获取当前班级
    let classId = ${classId};

    function getStudentsByClassId() {
        $.ajax({
            url: "./getClassesById?classId=" + classId,
            type: 'GET',
            dataType: "json",
            success: function (data) {
                classes = data;
                $("#classesTitle").html("<h5>" + classes.name + "班级学生列表</h5>" + " <a href='./classesinfo' class='btn btn-primary'>返回班级信息列表</a>");
            }
        })
    }

    getStudentsByClassId();
</script>
</body>
</html>
<jsp:include page="footer.jsp"/>
